<template>
<section>
    <el-col :sm="24" :lg="16">
        <div class="grid-content bg-purple" :style="{backgroundColor:titleColor}">
            <div class="dev-title">修改密码</div>
        </div>
        <div class="col-bg clearfix">
            <el-form ref="form" :rules="edituser" :model="form" label-width="100px" @submit.prevent="onSubmit" style="margin:20px;width:60%;min-width:600px;">
                <el-form-item label="老密码" prop="oldPassword">
                    <el-input type="password" v-model="form.oldPassword" auto-complete="off"></el-input>
                </el-form-item>
                <el-form-item label="新密码" prop="password">
                    <el-input type="password" v-model="form.password" auto-complete="off"></el-input>
                </el-form-item>
                <el-form-item label="确认新密码" prop="repassword">
                    <el-input type="password" v-model="form.repassword" auto-complete="off"></el-input>
                </el-form-item>

                <el-form-item>
                    <el-button :type="buttonColor" @click.native="onSubmit" :loading="editLoading">提交</el-button>
                </el-form-item>
            </el-form>
        </div>
    </el-col>
</section>
</template>

<script>
    import {
        userupdate_pass

    } from '../../api/api';
    export default {
        data() {
            return {
                editLoading: false,
                form: {
                    oldPassword: '',
                    password: '',
                    repassword: '',

                },
                edituser: {
                    oldPassword: [{
                            required: true,
                            message: '请输入旧密码',
                            trigger: 'blur'
                        },
                        {
                            pattern: /^[a-zA-Z0-9]{6,18}$/,
                            message: "密码由6-18位组成",
                            trigger: "blur"
                        }
                    ],
                    password: [{
                            required: true,
                            message: '请输入新密码',
                            trigger: 'blur'
                        },
                        {
                            pattern: /^[a-zA-Z0-9]{6,18}$/,
                            message: "密码由6-18位组成",
                            trigger: "blur"
                        }
                    ],
                    repassword: [{
                            required: true,
                            message: '请确认新密码',
                            trigger: 'blur'
                        },
                        {
                            pattern: /^[a-zA-Z0-9]{6,18}$/,
                            message: "密码由6-18位组成",
                            trigger: "blur"
                        }
                    ],

                }
            }
        },
        computed:{
            buttonColor(){
                return this.$store.state.buttonColor
            },
            titleColor(){
                return this.$store.state.titleColor
            },
            dialogTitleColor(){
                return this.$store.state.dialogTitleColor
            },
        },
        methods: {

            onSubmit() {
                if (this.menubt.indexOf('/user/update_pass') == -1) {
                    this.$message({
                        message: '您没有编辑自己密码的权限',
                        type: 'warning'
                    });
                    return false;
                }
                this.$confirm('确认提交吗？', '提示', {}).then(() => {
                    this.editLoading = true;
                    //NProgress.start();
                    let para = Object.assign({}, this.form);
                    userupdate_pass(para).then((res) => {
                        // this.begCode(res.code,res.message)
                        this.editLoading = false;
                        if (res.code == 0) {
                            //NProgress.done();
                            this.$message({
                                message: '修改成功',
                                type: 'success'
                            });

                        } else {
                            this.$message({
                                message: res.message,
                                type: 'warning'
                            });
                        }
                    });
                });
            }
        },
        mounted() {

            this.menubt = localStorage.getItem('menubt');
        }
    }
</script>